<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
	
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no, email=no" />
  	<meta property="og:title" content="">
    <!-- 分享描述 通常2-4句-->
    <meta property="og:description" content="">
    <!-- 网站名字-->
    <meta property="og:site_name" content="">
    <!-- 分享插图-->
    <meta property="og:image" content="">
    <!-- 分享链接-->
    <meta property="og:url" content="">
    <!-- facebook user id 可以多个-->
    <meta property="fb:admins" content="">
    <!-- facebook app id 统计facetook引流-->
    <meta property="fb:app_id" content="1634108950233660">
    <!-- 分享媒体类型 决定在facebook feed流中的展现形式 默认为website article vine-app:video-->
    <meta property="og:type" content="">
    <link rel="icon" type="image/png" href="../img/icon.png" sizes="32x32" />
    <link rel="stylesheet" href="../css/cssyoutube.css" type="text/css"/>
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" href="https://code.getmdl.io/1.1.3/material.indigo-pink.min.css">
	<!-- This code loads the iFrame Player API code asynchronously.-->
    <script src = "https://www.youtube.com/iframe_api"></script>
    <!-- This is the source of the Javscript for the demo -->
	<script src="../js/demo.js"></script>
    <title>Virally.video</title>
</head>
<body>
    <div id="header">
        <div class="header_left">
            <p>Virally.video</p>
        </div>
        <div class="header_right">
            <a id="install">Install</a>
        </div>
    </div>
    <div id="video">
		<div class="video_play">
			 <div id="player"></div>
		</div>
    </div>
	
</body>
<script type="text/html" id="video_detail">
    
    <div class="video_list">
        <div class="video_play_content">
            <!--<h5><%=title%></h5>-->
            <h5 style="position: relative;">Share with friends and family! <img src="../img/shire.png" style="width: 18px;position: absolute;right: 10px;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);"/></h5>
            <p class="video_play_count"><img src="../img/eye.png"/ style="width: 24px;margin-top: -3px;margin-right: 3px;"><%=video_play_count%> views</p>
            <div class="video_play_name">
                <div class="video_play_name_left" media_id="<%=media_id%>">
                    <!--<img src="<%=media_avatar_url%>"/> <%=media_name%>-->
                    <img src="../img/icon2.png"/> Install for more interesting content
                </div>
                <!--<div class="video_play_name_right">
                   
                </div>-->
            </div>
        </div>

    </div>
</script>
<script type="text/html" id="video_list">
    <ul>
        <%for(var i=0;i<data.length;i++){%>
        <li>
            <div class="video_list_img" style="background:#ccc url('<%=data[i].image_url%>') no-repeat center center;background-size: cover;">
                <p class="time"><%=data[i].video_duration_str%></p>
            </div>
            <div class="li_left">
                <h5><%=data[i].title%></h5>
            </div>
        </li>
        <%}%>
    </ul>
</script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/template-native.js"></script>
<script type="text/javascript" src="../js/indexyoutube.js"></script>

</html>
